<template>
  <div>
    <div class="head">
      <img class="img" src="../../assets/index/tag.png" alt="" />
      教育信息
      <img
        class="edit"
        v-if="this.formInline[0]"
        @click="dialogVisible = true"
        src="../../assets/index/edit.png"
        alt=""
      />
      <el-dialog
        title="修改教育信息"
        :visible.sync="dialogVisible"
        width="60%"
        @close="closeFun()"
      >
        <div v-for="(item, index) in formInline" :key="index">
          <el-form ref="item" :model="item" :inline="true" label-width="120px">
            <el-form-item class="el-form-item" label="学校:">
              <el-input
                class="el-input"
                v-model.trim="item.schoolName"
                placeholder="请输入学校名称"
              ></el-input>
            </el-form-item>
            <el-form-item label="就读专业:">
              <el-input
                class="el-input"
                v-model.trim="item.schoolMajor"
                placeholder="请输入专业名称"
              >
              </el-input>
            </el-form-item>
            <el-form-item label="平均分数(绩点):">
              <el-input
                class="el-input"
                v-model.trim="item.schoolGpa"
                placeholder="请输入平均分数(绩点)"
              >
              </el-input>
            </el-form-item>
            <el-form-item label="就读时间:">
              <el-input
                class="el-input"
                v-model.trim="item.startTime"
                placeholder="请输入就读时间"
              >
              </el-input>
            </el-form-item>
            <el-form-item label="学位等级:">
              <el-input
                class="el-input"
                v-model.trim="item.grape"
                placeholder="请输入学位等级"
              >
              </el-input>
            </el-form-item>
            <el-form-item label="交换学校名称:">
              <el-input
                class="el-input"
                v-model.trim="item.exchangeSchoolName"
                placeholder="请输入交换学校名称"
              >
              </el-input>
            </el-form-item>
            <el-form-item label="交换经历:">
              <el-input
                class="el-input"
                v-model.trim="item.exchangeExperience"
                placeholder="请输入交换经历"
              >
              </el-input>
            </el-form-item>
          </el-form>
        </div>
        <span slot="footer" class="dialog-footer">
          <el-button @click="dialogVisible = false">取 消</el-button>
          <el-button type="primary" @click="commit">确 定</el-button>
        </span>
      </el-dialog>
    </div>
    <div class="essential-information">
      <el-table
        class="el-table"
        ref="multipleTable"
        :data="educationInfo"
        border
        style="width: 100%"
      >
        <el-table-column prop="schoolName" label="大学名称"> </el-table-column>
        <el-table-column prop="schoolMajor" label="就读专业"> </el-table-column>
        <el-table-column prop="schoolGpa" label="平均分数（绩点）">
        </el-table-column>
        <el-table-column prop="" label="就读时间">
          <template slot-scope="scope">
            {{ scope.row.startTime }}年-{{ scope.row.endTime }}年</template
          >
        </el-table-column>
        <el-table-column prop="grape" label="学位等级"> </el-table-column>
        <el-table-column prop="exchangeSchoolName" label="交换学校名称">
        </el-table-column>
        <el-table-column prop="exchangeExperience" label="交换经历">
        </el-table-column>
      </el-table>
    </div>
  </div>
</template>

<script>
import search from "../../component/search/search.vue";
import paging from "../../component/paging/paging.vue";
import { getEducationInfo, updateEducationInfo } from "../../../src/api/index"; //教育信息
import indexLoginLogVue from "../../views/index/index/indexLoginLog.vue";
import qs from "qs";
export default {
  mounted() {
    this.getList();
  },
  components: {
    search, //筛选查询组件
    paging, //分页组件
  },
  data() {
    return {
      current: "",
      pagesize: "",
      total: 0, //一共多少条数据
      dialogVisible: false, //点击弹出编辑框
      educationInfo: [], //教育信息
      formInline: [],
      updateInfo: [],
      // formInline: {
      //   schoolName: '',
      //   schoolMajor: '',
      //   schoolGpa: '',
      //   startTime: '',
      //   endTime: '',
      //   grape: '',
      //   exchange: '',
      //   exchangeTime: '',
      // },
    };
  },
  methods: {
    closeFun() {
      console.log(1);
      //重置form表单
      // this.formInline = {}
      // this.$refs['formInline'].resetFields();
      // this.$refs['multipleTable'].clearSelection();
    },
    currentpage(val) {
      // console.log(val);
      this.current = val; //得到新的当前页
      this.getList(); //获取新的数据列表
    },
    size(val) {
      // console.log(val);
      this.pagesize = val; //得到新当前页的一共几行数据
      this.getList(); //获取新的数据列表
    },
    getList() {
      //教育信息
      getEducationInfo(window.sessionStorage.getItem("orderId")).then(
        (data) => {
          this.educationInfo = data.data;
          console.log(data.data);
          this.formInline = JSON.parse(JSON.stringify(data.data));
        }
      );
      // updateEducationInfo(education,exchange,exchangeTime,window.sessionStorage.getItem('orderId')).then(data => {
      //   this.educationInfo = data.data
      //   console.log(data.data);
      // });
    },
    commit() {
      this.dialogVisible = false;
      // updateEducationInfo(
      //   this.formInline[0].eid,
      //   this.formInline[0].endTime,
      //   this.formInline[0].exchangeExperience,
      //   this.formInline[0].exchangeSchoolName,
      //   this.formInline[0].grape,
      //   window.sessionStorage.getItem('orderId'),
      //   this.formInline[0].schoolGpa,
      //   this.formInline[0].schoolMajor,
      //   this.formInline[0].schoolName,
      //   this.formInline[0].startTime
      // ).then((data) => {
      //   console.log(data)
      //   this.getList()
      // })
      let data = qs.stringify({
        aaa: "",
        eid: this.formInline[0].eid,
        endTime: this.formInline[0].endTime,
        exchangeExperience: this.formInline[0].exchangeExperience,
        exchangeSchoolName: this.formInline[0].exchangeSchoolName,
        grape: this.formInline[0].grape,
        orderId: window.sessionStorage.getItem("orderId"),
        schoolGpa: this.formInline[0].schoolGpa,
        schoolMajor: this.formInline[0].schoolMajor,
        schoolName: this.formInline[0].schoolName,
        startTime: this.formInline[0].startTime,
        bbb: "",
      });
      updateEducationInfo(data).then((res) => {
        console.log(res);
        this.getList();
      });
    },
  },
};
</script>

<style>
.img {
  width: 15px;
  height: 15px;
  margin-top: 15px;
}
.head {
  height: 50px;
  padding-top: 20px;
  padding-left: 20px;
  color: #666666;
  font-size: 18px;
}
.essential-information {
  margin-top: 20px;
  margin-left: 20px;
}
.edit {
  width: 20px;
  height: 20px;
  padding-top: 20px;
  margin-left: 20px;
}
.paging {
  margin-top: 15px;
  text-align: center;
}
</style>